<template>
	<view>
		<div>
			<navitop>
				<i class="iconfont" slot="left-slot" @click="outlot">&#xe667;</i>
				<span slot="center-slot">{{url_data.title + '添加'}}</span>
			</navitop>
		</div>
		<div :style="'padding-top:' + nv_height">
			<div class="bill_sty" v-for="(item,index) in title_dataSorce" v-if="item.code == 'purchaseTypeId' || item.code == 'invoiceTypeId' || item.code == 'purchaseInvoiceNo' || item.code == 'vendorId' || item.code == 'salesmanId'">
				<div class="bill_list" >
					<div class="bill_title">
						{{item.name}}：
					</div>
					<div class="bill_input" @click='choice(item)' v-if="item.code !== 'voucherCode' && item.code !== 'purchaseInvoiceNo'">
						<input v-model="item.values" disabled />
					</div>
					<div class="bill_input" v-else-if="item.code == 'purchaseInvoiceNo'">
						<input v-model="item.value" @input="unber_inp"/>
					</div>
					<div class="bill_input" v-else>
						<input v-model="item.value" disabled />
					</div>
				</div>
				
			</div>
			<div class="bill_content" >
				<div class="bill_content_title">
					物料选择
				</div>
				<div class="bill_manual">

					<div class="bill_manual_choose">
						<span @click="sweep_code">扫码获取</span>
						<span @click="material">选择物料</span>
					</div>
				</div>
			</div>
			<div class="bill_content" v-for="(item,index) in list_dataSorce" @click="edit(item.id)">
				<div class="bill_fiexd" @click.stop="data_del(item.id)">
					<i class="iconfont icon-shanchu"></i>
				</div>
				<div class="bill_content_list" >
					<div class="bill_title">物料编码:</div>
					<div class="bill_input_rst">
						{{item.inventoryCode}}
					</div>
				</div>	
				<div class="bill_content_list" >
					<div class="bill_title">物料名称:</div>
					<div class="bill_input_rst">
						{{item.inventoryName}}
					</div>
				</div>
				<div class="bill_content_list" >
					<div class="bill_title">规格型号:</div>
					<div class="bill_input_rst">
						{{item.inventorySpecification}}
					</div>
				</div>	
				<div class="bill_content_list" >
					<div class="bill_title">主计量:</div>
					<div class="bill_input_rst" v-if="item.baseUnitName">
						{{item.baseUnitName}}
					</div>
					<div class="bill_input_rst" v-else>
						{{item.baseUnitName}}
					</div>
				</div>	
				<div class="bill_content_list" >
					<div class="bill_title">数量:</div>
					<div class="bill_input_rst" v-if="the_Number">
						{{item.baseQuantity}}
					</div>
				</div>	
				
			</div>
			
			<div style="height: 50px;"></div>
			
			<div class="bottom_type" :style="'width:' + defaultPhoneWidth">
				<div @click="http_up">提交</div>
			</div>
			
			<div class="bottom_type bottom_bg" :style="'width:' + defaultPhoneWidth" v-if="call_click"></div>
		</div>
		
		
		<!-- 数量弹窗 -->
		<popus ref="alert_sub">
			<div :style="'padding-top:' + nv_height_alert + ';background:#fff;'">
				<div class="alert_out">
					<div class="alert_text_title">请输入数量</div>
		
					<div class="alert_text" style="color: #555555;">
						<div class="alert_text_left">物料名称：</div>
						<div class="alert_text_right">{{dataSorces.inventoryName}}</div>
					</div>
					<div class="alert_text" style="color: #555555;">
						<div class="alert_text_left">规格型号：</div>
						<div class="alert_text_right">{{dataSorces.inventorySpecification}}</div>
					</div> 
					<div class="alert_text" style="color: #555555;">
						<div class="alert_text_left">主计量：</div>
						<div class="alert_text_right" v-if="dataSorces.unitName">{{dataSorces.unitName}}</div>
						<div class="alert_text_right" v-else>{{dataSorces.mainUnitName}}</div>
					</div>
					
					<view v-if='setType'>
						<div class="alert_text" style="color: #555555;">
							<div class="alert_text_left">辅计量：</div>
								<select-lay :zindex="1" :placeholder="tval_begin" :options="setlist" @selectitem="unitDataList">
							</select-lay>
						</div>	
						<div class="alert_text" style="color: #555555;">
							<div class="alert_text_left">辅计数：</div>
							<div class="alert_text_right" >
								<input v-model="setNumber" @input="unit_result"/>
							</div>
						</div>
						<div class="alert_text" style="color: #555555;">
							<div class="alert_text_left">换算率：</div>
							<div class="alert_text_right">
								{{setNv}}
							</div>
						</div>
					</view>
					
					<div class="alert_text" v-if="setType">
						<div class="alert_text_left">数量：</div>
						<div class="alert_text_right"><input v-model="dataSorces.baseQuantity" type="number" @input="basequan"/></div>
					</div>
					<div class="alert_text" v-else>
						<div class="alert_text_left">数量：</div>
						<div class="alert_text_right"><input v-model="dataSorces.baseQuantity" type="number"/></div>
					</div>
					
					<div class="alert_button" @click='Number_alert(dataSorces)'>
						<button>确定</button>
					</div>
				</div>
			</div>
		</popus>
		
		<!-- 搜索上拉 -->
		<popus ref="science_al">
			<div :style="'width:' + bo_windth " class="bill_wiat">
				<sciencealer @row="row" @closes="closes" :dataSorc="popup_Data"></sciencealer>
			</div>
		</popus>

		<!-- 选择物料 -->
		<popus ref="bill_alert">
			<div :style="'width:' + bo_windth " class="bill_wiat">
				<billde @bill_end="bill_end"></billde>
			</div>
		</popus>

		<!-- 扫码 -->
		<moncode :Scan_code="scancode"></moncode>
		
		
	</view>
</template>

<script>
	import navitop from '@/components/common/navi-top'
	import billde from '@/components/common/bill/bill-details-alert.vue'
	import alertcenter from '@/pages/common/common/alert/alertcenter'
	import popus from '@/uni_modules/uni-popup/components/uni-popup/uni-popup'
	import sciencealer from '@/pages/common/common/alert/sciencealert'
	import moncode from "@/components/dumenghanfeng-monitorScanCode/monitorScanCode.vue"
	import {current_time} from "@/common/api/common/public_api.js"
	import {voucherDesign,Invoicesave} from '@/common/api/procure/procureapi.js'
	import {pageList,officepage,sysUserpage,pogetCode,invoiceTypeList,ForVoucher} from '@/common/api/common/tools_api.js'
	import {inventorypageList,unitPageList} from '@/common/api/job/bill.js'
	export default {
		components: {
			navitop,
			alertcenter,
			popus,
			moncode,
			billde,
			sciencealer
		},
		data() {
			return {
				nv_height: '',
				title_dataSorce: [],
				list_dataSorce: [],
				dataSorces: {},
				up_data: {
					current: 1,
					size: -1,
					searchKey: '',
					'page.current': 1,
					'page.size': -1
				},
				
				Code_dataSorce: [], // 获取用户扫码结果

				scancode: 'Warehouse', // 扫码自定义事件

				title_data: [], //扫码数组却从
				
				url_data: '',
				
				popup_Data: [],	//弹窗显示数据
				
				defaultPhoneWidth: '',	// 获取屏幕宽度
				
				bo_windth:'',	// 获取屏幕宽度
				
				nv_height_alert: '',	// 状态窗口顶部距离
				
				data_id: '',	// 获取当条数据id
				
				baseQuantity: '', //数量
				
				number_type: true,
				
				call_click: false,	//  防止重复点击
				
				purchaseInvoiceNo: '',	// 发票号
				
				setlist: [],	//
				
				setType: false,	// 多计量显示
				
				the_Number: true,
				
				setNumber: '',	// 辅计量数量
				
				setNv: '',	//换算率
				
				tval_begin: '请选择辅计量',
			}
		},
		onLoad(option) {
			this.url_data = option;
			let _this = this;
			uni.$off(this.scancode);
			uni.$on(this.scancode, function(rst) {
				console.log('扫码结果', rst.msg)
				_this.scan_code = rst.msg; // 获取扫码结果
				_this.inventory_list(rst.msg);
			})
		},
		mounted() {
			this.defaultPhoneWidth = uni.getSystemInfoSync().windowWidth + 'px';
			this.bo_windth = uni.getSystemInfoSync().windowWidth + 'px';
			this.nv_height = uni.getSystemInfoSync().statusBarHeight + 60 + 'px';
			this.nv_height_alert = uni.getSystemInfoSync().statusBarHeight + 15 + 'px';
			
			this.http_curl();
			
			
		},
		methods: {

			// 返回 
			outlot() {
				uni.redirectTo({
					url: '/pages/common/index/procure/common?title=' + this.url_data.title + '&code=' + this.url_data.code + '&sort=0'
				})
			},
			
			// 统一请求
			http_curl(){
				// 获取列表
				this.voucherList();
			},
			
			// 获取自定义列表
			voucherList(){
				voucherDesign({source: this.url_data.code}).then(item => {
					if(item.code == 200){
						this.title_dataSorce = item.data;
						//获取单据编号
						this.bill_code();
					}
				})
			},
			
			// 获取单据编号
			bill_code(){
				pogetCode().then(item => {
					if(item.code == 200){
						this.title_dataSorce.forEach(rst => {
							if(rst.code == 'voucherCode'){
								this.$set(rst,'value',item.message)
							}
						})
					}
				})
			},
			
			// 点击获取扫码(相机)
			sweep_code() {
				// uni.removeStorageSync('details_dataSorce');
				let _this = this;
				uni.scanCode({
					onlyFromCamera: true,
					success: function(res) {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
						_this.scan_code = res.result; // 获取扫码结果
						_this.inventory_list(res.result);
					}
				});
			},

			
			// 扫码获取物料
			inventory_list(val) {
				let _this = this;
				let copy_type = [];
				copy_type = this.list_dataSorce.filter(item => item.inventoryCode == this.scan_code);
				if (copy_type.length == 0) {
					inventorypageList({code: val }).then((rows) => {
						if (rows.code == 200) { 
							this.list_dataSorce.push(rows.data);
							this.dataSorces = rows.data;
							this.dataSorces['baseQuantity'] = '';
							if(rows.data.mainUnit) {
								this.dataSorces['baseUnit'] = rows.data.mainUnit;
								this.dataSorces['baseUnitName'] = rows.data.mainUnitName;
								this.dataSorces['baseUnit_temp_id'] = rows.data.mainUnit;
								this.worshow_list(rows.data.unitGroupId);
								this.setType = true;
							}else{
								this.dataSorces['baseUnit'] = rows.data.unitId;
								this.dataSorces['baseUnitName'] = rows.data.unitName;
								this.dataSorces['baseUnit_temp_id'] = rows.data.unitId;
								this.setType = false;
							}
							_this.$refs.alert_sub.open('top');
						}
					})
				} else {
					uni.showModal({
						title: '提示',
						content: '扫码重复，是否修改数量',
						success: function(res) {
							if (res.confirm == true) {
								_this.dataSorces = copy_type[0];
								if(copy_type[0].unitGroupId){
									_this.worshow_list(copy_type[0].unitGroupId);
									_this.setType = true;
								}else{
									_this.setType = false;
								}
								_this.$refs.alert_sub.open('top');
							}
						}
					})
				}
			},

			// 弹窗处理(数据处理)
			choice(val) {
				
				this.popup_Data = [];
				// 发票类型
				if (val.code == 'invoiceTypeId') {
					this.invoice_List(val.code);
				}
				// 获取供应商
				if (val.code == 'vendorId') {
					this.User_list('vendorId');
				}
				// 获取部门
				if (val.code == "officeId") {
					this.warehouse_list(val.code);
				}
				// 采购类型
				if (val.code == 'purchaseTypeId') {
					this.purchase_list(val.code);
				}
				// 员工
				if (val.code == 'salesmanId') {
					this.voucher_list(val.code);
				}
				
				

				this.$refs.science_al.open('bottom');
			},

			// 弹窗处理(获取弹窗结果)
			row(val) {
				this.title_dataSorce.filter((item) => {
					if (item.code == val.code) {
						this.$set(item, 'values', val.name);
						this.$set(item, 'value', val.id);
					}
				})
				this.$refs.science_al.close();
			},
			
			
			// 获取发票类型
			invoice_List(valCode){
				let _this = this;
				invoiceTypeList({
					current: 1,
					size: -1,
					type: '',
					'page.current': 1,
					'page.size': -1
				}).then((rst) => {
					if (rst.code == 200) {
						rst.data.records.filter((item) => {
							_this.popup_Data.push({
								name: item.name,
								code: valCode,
								id: item.id
							})
						})
					}
				})
			},

			// 获取供应商
			User_list(valCode) {
				let _this = this;
				ForVoucher({
					current: 1,
					size: -1,
					isFinance: 1,
					companyType: 'isSupplier',
					'page.current': 1,
					'page.size': -1
				}).then((rst) => {
					if (rst.code == 200) {
						rst.data.records.filter((item) => {
							_this.popup_Data.push({
								name: item.crmName,
								code: valCode,
								id: item.id
							})
						})
					}
				})
			},

			// 部门
			warehouse_list(valCode) {
				let _this = this;
				officepage(this.up_data).then((rst) => {
					if (rst.code == 200) {
						rst.data.records.filter((item) => {
							_this.popup_Data.push({
								name: item.officeName,
								code: valCode,
								id: item.id,
							})
						})
					}
				})
			},

			// 获取采购列表
			purchase_list(valCode) {
				let _this = this;
				pageList(this.data_curl_rst).then((rows) => {
					if (rows.code == 200) {
						rows.data.records.filter((item) => {
							_this.popup_Data.push({
								name: item.name,
								code: valCode,
								id: item.id,
								D_Code: item.code
							})
						})
					}
				})
			},

			// 获取员工
			voucher_list(valCode) {
				let _this = this;
				sysUserpage(this.up_data).then((rows) => {
					if (rows.code == 200) {
						rows.data.records.filter((item) => {
							_this.popup_Data.push({
								name: item.realName,
								code: valCode,
								id: item.id,
							})
						})
					}
				})
			},
			
			
			// 多计量
				worshow_list(val){
				this.setlist = [];
				unitPageList({size:1000,current:1}).then(item => {
					if(item.code == 200){
						item.data.records.forEach(rst => {
							if(rst.unitGroupId && !rst.isMainUnit){
								if(rst.unitGroupId == val){
									this.setlist.push({label: rst.name,value: rst})
								}
							}
						})	
					}
				})
			},
			
			// 选中辅计量
			unitDataList(val){
				// 选中辅计量
				this.tval_begin = this.setlist[val].label;
				// 换算率
				this.setNv = this.setlist[val].value.changeRate;
				// 切换计算
				this.dataSorces.baseQuantity = this.setNumber * this.setNv;
				
				// 换算率
				this.dataSorces['unitExchangeRate'] = this.setlist[val].value.changeRate;
				// 辅计量名称
				this.dataSorces['subUnitName'] = this.setlist[val].label;
				// 数量
				this.dataSorces['baseQuantity'] = this.setNumber * this.setNv;
				
			},
			
			// 辅计量输入
			unit_result(val){
				if(this.setNv){
					this.dataSorces.baseQuantity = val.target.value * this.setNv;
				}else{
					uni.showToast({
						title: '请选择辅计量！',
						icon: 'none'
					})
				}
				
			},
			
			// 输入数量
			basequan(val){
				if(this.setNv){
					this.setNumber = val.target.value / this.setNv;
				}else{
					uni.showToast({
						title: '请选择辅计量！',
						icon: 'none'
					})
				}
			},
			
			
			// 获取选中物料 
			bill_end(val) {
				console.log(val)
				if(val){	
					let repeatData = '';
					this.dataSorces = val;
					this.dataSorces['baseQuantity'] = '';
					if(val.unitType == "多计量") {
						this.dataSorces['baseUnit'] = val.mainUnit;
						this.dataSorces['baseUnitName'] = val.mainUnitName;
						this.dataSorces['baseUnit_temp_id'] = val.mainUnit;
						this.worshow_list(val.unitGroupId);
						this.setType = true;
					}else{
						this.dataSorces['baseUnit'] = val.unitId;
						this.dataSorces['baseUnitName'] = val.unitName;
						this.dataSorces['baseUnit_temp_id'] = val.unitId;
						this.setType = false;
					}
					
					repeatData = this.list_dataSorce.filter(item => item.id == val.id)
					if(repeatData.length == 0){
						this.data_id = val.id;
						this.list_dataSorce.push(val)
						this.$refs.alert_sub.open('top');
					}else {
						this.data_id = val.id;
						this.$refs.alert_sub.open('top');
					}
					this.$refs.bill_alert.close();
				}else {
					this.$refs.bill_alert.close();
				}
			},
			
			// 点击获取物料信息
			material() {
				this.$refs.bill_alert.open('right')
			},
			
			// 数量获取
			Number_alert(val){
				this.the_Number = false;
				this.setType = false;
				this.list_dataSorce.forEach(item => {
					if(item.id == val.id){
						this.$set(item,'baseQuantity',Number(val.baseQuantity));
					}
				})
				this.the_Number = true;
				this.$refs.alert_sub.close();
			},
			// 修改物料信息
			edit(val){
				this.list_dataSorce.forEach(item => {
					if(item.id == val){
						if(item.unitType == '多计量'){
							this.setType = true;
						}else{
							this.setType = false;
						}
						this.dataSorces = item;
					}
				})
				this.$refs.alert_sub.open('top');
			},
			
			// 删除档条数据
			data_del(val){
				for(let i in this.list_dataSorce){
					if(this.list_dataSorce[i].id == val){
						this.list_dataSorce.splice(i,1);
					}
				}
			},
			
			// 发票号处理
			unber_inp(val){
				this.purchaseInvoiceNo = val.target.value;
			},
			
			// 提交
			http_up(){
				let dataSorce = {};
				let _this = this;
				uni.showLoading({
					title: '加载中...'
				})
				this.call_click = true;
				dataSorce['dataSource'] = this.url_data.code;
				this.title_dataSorce.forEach(item => {
					//发票类型
					if(item.code == 'invoiceTypeId'){
						dataSorce['invoiceTypeId'] = item.value;
						dataSorce['invoiceTypeName'] = item.values;
					}else 
					// 获取供应商
					if(item.code == 'vendorId'){
						dataSorce['vendorId'] = item.value;
						dataSorce['vendorName'] = item.values;
					}else
					// 获取部门
					if(item.code == 'officeId'){
						dataSorce['officeId'] = item.value;
						dataSorce['officeName'] = item.values;
					}else
					// 采购类型
					if(item.code == 'purchaseTypeId'){
						dataSorce['purchaseTypeId'] = item.value;
						dataSorce['purchaseTypeName'] = item.values;
					}else
					// 采购类型
					if(item.code == 'salesmanId'){
						dataSorce['salesmanId'] = item.value;
						dataSorce['salesmanName'] = item.values;
					}
					else {
						dataSorce[item.code] = item.value;
					}
				})
				
				
				this.list_dataSorce.filter(item => { 
					this.$set(item,'inventoryId',item.id),
					delete item.id;
				})
				// 物料列表
				dataSorce['orderDetailList'] = this.list_dataSorce;
				dataSorce['voucherDate'] = current_time();
				// 发票号
				dataSorce['purchaseInvoiceNo'] = this.purchaseInvoiceNo;
				Invoicesave(dataSorce).then(item => {
					if(item.code == 200){
						uni.hideLoading();
						uni.showToast({
							title: '保存成功',
							icon: 'none'
						});
						setTimeout(()=> {
							_this.outlot();
						},1500)
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.icon-shanchu{
		color: red;
		position: absolute;
		right: 0;
		padding: 10px 20px 0 0;
	}
	
	.bottom_type {
		position: fixed;
		bottom: 0;
		text-align: center;
		height: 40px;
		line-height: 40px;
		background-color: #0098EF;
		color: #fff;
		border-radius: 4px;
		box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
	}
	
	.alert_text_title {
		padding: 10px 0 10px 30rpx;
		font-size: 20px;
		border-bottom: 1px solid #cacaca;
	}

	.bill_wiat {
		width: 100%;
		height: 100%;
		background-color: #fff;
	}


	.remaks_data {
		height: 90rpx;
		line-height: 90rpx;
		text-align: center;
		color: #cacaca;
	}

	// 产品选择样式
	.bill_manual {
		background-color: #fff;
		text-align: center;
		width: 100%;
		margin: auto;
	}

	.bill_manual_choose {
		border-top: 1px solid #cacaca;
		padding: 10px 0 0 0;
		width: 95%;
		margin: auto;
		height: 90rpx;
		line-height: 90rpx;

		span {
			padding: 1% 8% 1% 8%;
			border-radius: 4px;
			background-color: #007AFF;
			color: #fff;
			margin: 10px;
		}
	}

	// 备注模块

	.remarks_inpt {
		width: 95%;
		margin: auto;
		padding: 0 0 90rpx 0;

		textarea {
			width: 100%;
			height: 120rpx;
			margin: 10px 0 10px 0;
		}
	}

	.remarks_txt {
		width: 95%;
		margin: auto;
		height: 60rpx;
		line-height: 60rpx;
		border-bottom: 1px solid #cacaca;
	}

	.remarks_style {
		margin: 10px 0 0 0;
		background-color: #fff;
		box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
	}


	.bill_content_button {
		height: 90rpx;
		line-height: 90rpx;
		background-color: rgb(34, 131, 228);
		text-align: center;
		color: #fff;
		border-radius: 4px;
		box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
		margin: 10px 0 0 0;
		position: fixed;
		bottom: 0;
	}

	.alert_button {
		padding: 0 0 5px 0;

		button {
			width: 60%;
			background-color: rgb(34, 131, 228);
			color: #fff;
		}
	}

	.alert_out {
		background-color: #fff;
		border-radius: 4px;
		box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
	}

	.alert_text {
		display: flex;
		width: 100%;
		height: 90rpx;
		line-height: 90rpx;
		// margin: 10px 0 10px 0;
		// padding: 10px 0 10px 0;
	}

	.alert_text_left {
		width: 30%;
		text-align: right;
	}

	.bill_sty {
		background-color: #fff;
		padding: 10px 0 10px 0;
	}

	.bill_list {
		width: 90%;
		margin: auto;
		height: 70rpx;
		line-height: 70rpx;
		padding: 0 0 0 30rpx;
		display: flex;
	}

	.bill_title {
		width: 30%;
		overflow: hidden;
		text-align: left;
	}

	.alert_text_right {
		width: 68%;

		input {
			border: 1px solid #cacaca;
			width: 90%;
		}
	}

	.bill_input {
		width: 65%;

		input {
			width: 90%;
			border: 1px solid #cacaca;
			height: 50rpx;
		}
	}

	.bill_input_rst {
		width: 65%;
		margin: 0 0 0 20rpx;
	}

	// 数据列表
	.bill_content {
		background-color: #fff;
		margin-top: 10px;
		padding: 10rpx 0 10px 0;
	}

	.bill_content_mx {
		background-color: #fff;
	}

	.bill_content_list {
		width: 90%;
		margin: auto;
		display: flex;
		height: 60rpx;
		line-height: 60rpx;
	}

	.bill_content_title {
		padding: 10rpx 0 10rpx 30rpx;
		margin-bottom: 5px;
	}


	// 上拉修改弹窗

	.conten_del {
		position: fixed;
		top: 0;
		right: 5%;
		color: red;
		padding: 10px 10px 10px 10px;
		font-size: 20px;
	}

	.conten_edit_input {
		width: 50%;
	}

	.conten_edit_inputs {
		display: flex;
		justify-content: space-between;

		input {
			border: 0;
		}
	}

	.conten_edit_bottom {
		height: 50px;
		line-height: 50px;
		text-align: center;
		background-color: #1890FF;
		color: #fff;
		font-size: 18px;
		border-radius: 4px;
		box-shadow: 0 12px 2px 0 rgba(0, 0, 0, 0.1);
	}

	.conten_edit_public {
		padding-top: 5px;
	}

	.conten_edit_bod {
		border-top: 0 !important;
		border-bottom: 0 !important;
	}

	.conten_edit_right_bod {
		border-right: 0 !important;
	}

	.conten_edit_plus {
		display: flex;
		text-align: center;

		div {
			border: 1px dotted #cacaca;
			width: 80rpx;
		}
	}

	.conten_edit_type {
		display: flex;
		border-bottom: 1px dotted #cacaca;
		// overflow: hidden;
	}

	.conten_edit_left {
		width: 30%;
	}

	.conten_edit_right {
		width: 70%;
	}

	.conten_edit {
		height: 310px;
		width: 90%;
		margin: auto;

		div {
			height: 80rpx;
			line-height: 80rpx;
		}
	}

	.conten {
		width: 100%;
		background-color: #fff;
	}
	.bottom_bg {
		opacity: 0.2;
	}
</style>
